<!DOCTYPE html>
<html lang="">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <link rel="stylesheet" href="css/css.css">
    <link rel="stylesheet" href="css/style.css">
    <script src="http://apps.bdimg.com/libs/jquery/1.10.1/jquery.min.js"></script>
    <script type="text/javascript">
        !window.jQuery && document.write('<script src="js/jquery.min.js"><\/script>');
    </script>
    <script src="js/public.js"></script>
    <title>云中宝</title>
</head>

<body>
<div class="wrapper">
<div class="header">
    <ul class='clearfix'>
        <li class="header_btn_wrapper float_l"><a href="javascript:goHistory()" class="header_btn"><img src="images/return_icon.png" alt=""></a></li>
        <li class="header_btn_wrapper float_r"><a href="javascript:goHome()" class="header_btn"><img src="images/home_icon.png" alt=""></a></li>
        <li class="header_title_wrapper">个人基本信息</li>
    </ul> 
</div>
<div class="main">  
    <form action="" class="intro_form">
    <div class="rows content_wrapper intro bg_white">
        <div class="cols12">
           <div class="intro_head">
               <img src="images/head/2.jpg" width="100%" alt="">               
           </div>
           <p class="intro_txt font_999">更换个人头像</p>
        </div>
    </div>
    <div class="content_wrapper pd10">
        <ul class="cnt_list">
            <li class=""><p>姓名：<span>王小敏</span></p></li>
            <li class=""><p>性别：<span>女</span></p></li>
            <li class=""><p>身份证号码：<span>330328198509103268</span></p></li>
            <li class=""><p>出生日期：<span>1095-09-10</span></p></li>
            <li class=""><p>现居住地址：<span>北京市海淀区五棵松体育馆</span></p></li>
            <li class=""><p>户籍地址：<span>北京市朝阳区安慧北里12号</span></p></li>
            <li class=""><p>手机：<span>15812345678</span></p></li>
            <li class=""><p>电子邮箱：<span>450809923@qq.com</span></p></li>
            <li class=""><p>紧急联系人：<span>李冰</span></p></li>
            <li class=""><p>紧急联系人电话：<span>13288990566</span></p></li>
        </ul>
        <div class="form_item">
            <a class="btn btn_lg bg_orange w_10" href="self_intro_change_self.html">修改</a>        
        </div>
    </form>
    <div class="select_head pd10">
        <div class="rows">
            <div class="cols3">
                <div class="head_elm">
                    <img src="images/head/1.jpg" alt="">
                </div> 
            </div>
            <div class="cols3">
                <div class="head_elm">
                    <img src="images/head/2.jpg" alt="">
                </div> 
            </div>
            <div class="cols3">
                <div class="head_elm">
                    <img src="images/head/3.jpg" alt="">
                </div> 
            </div>
            <div class="cols3">
                <div class="head_elm">
                    <img src="images/head/4.jpg" alt="">
                </div> 
            </div>
            <div class="cols3">
                <div class="head_elm">
                    <img src="images/head/5.jpg" alt="">
                </div> 
            </div>
            <div class="cols3">
                <div class="head_elm">
                    <img src="images/head/6.jpg" alt="">
                </div> 
            </div>
            <div class="cols3">
                <div class="head_elm">
                    <img src="images/head/7.jpg" alt="">
                </div> 
            </div>
            <div class="cols3">
                <div class="head_elm">
                    <img src="images/head/8.jpg" alt="">
                </div> 
            </div>

        </div>
        <div class="intro_btn_group">
            <a href="javascript:void(0)" class="btn btn_lg head_select_ok">确 定</a>    
        </div>
        
    </div>
    
</div> 
</div>
<div class="footer">
    <ul class="toolbar">
        <li class="account active"><a href="javascript:void(0)"><p>我的账户</p></a></li>
        <li class="transact"><a href="javascript:void(0)"><p>我要办理</p></a></li>
        <li class="info"><a href="javascript:void(0)"><p>服务信息</p></a></li>
        <li class="setting"><a href="javascript:void(0)"><p>个人设置</p></a></li>
    </ul>
</div>
</div>
<script src="js/city.js"></script>
<script type="text/javascript">
$(function(){
window.check=function(){
}
var h = $(window).height();
for(var i=0,len=$('.head_elm').length;i<len;i++){
    var _src = $($('.head_elm img')[i]).attr('src')
    var _accSrc =  $('.intro_head img').attr('src');
    if(_src == _accSrc){
        $($('.head_elm')[i]).addClass('active')
    }
}
$('.select_head').css('height',h-218+'px')
$('.intro_head').bind('click',function(){
    $('.select_head').hasClass('active')?$('.select_head').removeClass('active'):$('.select_head').addClass('active');
})
$('.head_elm').bind('click',function(){
    if($(this).hasClass('active')){
//        $(this).removeClass('active')
    }else{
        $(this).addClass('active').parent().siblings('div').find('.head_elm').removeClass('active');
    }
})
$('.head_select_ok').bind('click',function(){
    var _parent = $(this).parent().parent();
    var _src = _parent.find('.head_elm.active img').attr('src');
    _parent.removeClass('active')
    $('.intro_head img').attr('src',_src)
})   

})
</script>   
</body>
</html>